import React from 'react'

import api from '../../../api/cnotice';
import { Form, Input, Tooltip, Icon, Cascader, Select, Row, Col, Checkbox, Button,Message,Radio,TreeSelect,DatePicker } from 'antd';
import moment from 'moment';
import CommunityCascader from '../../Cascader/CommunityCascader';
const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;
const { TextArea } = Input;
const dateFormat = 'YYYY/MM/DD hh:mm:ss';
const { MonthPicker, RangePicker } = DatePicker;

import './index.less'

class NoticeForm extends React.Component {
  state = {
    confirmDirty: false,
  };
  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll((err, values) => {   //提交后得到from表单中得值
      if (!err) {
        values.infoId=values.infoId[values.infoId.length-1] //设置级联infoId
        if(values.id){
            this.updateNotice(values);
        }else{
             this.addNotic(values);
        }
      }
    });
  }
  handleConfirmBlur = (e) => {
    const value = e.target.value;
    this.setState({ confirmDirty: this.state.confirmDirty || !!value });
  }
  checkPassword = (rule, value, callback) => {
    const form = this.props.form;
    if (value && value !== form.getFieldValue('password')) {
      callback('Two passwords that you enter is inconsistent!');
    } else {
      callback();
    }
  }
  checkConfirm = (rule, value, callback) => {
    const form = this.props.form;
    if (value && this.state.confirmDirty) {
      form.validateFields(['confirm'], { force: true });
    }
    callback();
  }

addNotic = (values) => {
  console.log(values);
    api.post('/addNotice', values).then((data) => {
      const {addfinish} = this.props;
      const result=data.data;
      if(result.code==0){
         Message.success('添加成功！');
          addfinish();
      }else{
          Message.error('添加失败！');
      }
    });
  }
  updateNotice = (values) => {
    api.put('/updateNotice', values).then((data) => {
          const result=data.data;
          const {upfinish} = this.props;
           if(result.code==0){
             Message.success("修改成功");
              upfinish();
           }else{
             Message.error("修改失败");
           }
    });
  }
  render() {
    const { getFieldDecorator,resetFields } = this.props.form;
    const { close , callbackParent ,roles,offices} = this.props;
    const notice = this.props.notice;
    const user = this.props.user;
     
    // 把重置表单的方法传给父亲
    callbackParent({
      resetFields:resetFields
    });

    const formItemLayout = {
      labelCol: { span: 6 },
      wrapperCol: { span: 14 },
    };
    const tailFormItemLayout = {
      wrapperCol: {
        xs: {
          span: 14,
          offset: 0,
        },
        sm: {
          span: 14,
          offset: 6,
        },
      },
    };
    return (
      <Form onSubmit={this.handleSubmit}>
        <FormItem>
          {getFieldDecorator('id', {
              initialValue:notice ? notice.id : ''
          })(
            <Input type="hidden"/>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="公告标题"
          hasFeedback
        >
          {getFieldDecorator('title', {
            rules: [ {
              required: true, message: '公告标题', 
            }],
            initialValue:notice ? notice.title : ''
          })(
            <Input />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="所属社区"
          hasFeedback
        >
          {getFieldDecorator('infoId', {
             rules: [{
              required: true, message: '所属社区',
            }],
            initialValue:notice ? notice.infoId : ''
            })(
              <CommunityCascader pid={user.officeId}  maxLevel={user.officeType==1?1:user.officeType==2?2:user.officeType==3?3:user.officeType==4?4:user.officeType==5?5:6}  />
              )}
        </FormItem>
         <FormItem
         style={{ display: "none" }}
          {...formItemLayout}
          label="所属机构"
          hasFeedback
        >
          {getFieldDecorator('officeId', {
            rules: [{

            }],
             initialValue:notice ? notice.officeId : ''
          })(
            <TreeSelect
            dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
            treeData={offices}
            placeholder="请选择一个机构"
            treeDefaultExpandAll
          />
          )}
        </FormItem>
       <FormItem
          {...formItemLayout}
          label="公告内容"
          hasFeedback
        >
          {getFieldDecorator('content', {
            rules: [{
              required: true, message: '公告内容!',
            }],
            initialValue:notice ? notice.content : ''
          })(
            <Input />
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="状态"
        >
          {getFieldDecorator('state', {
            rules: [{ required: true, message: '登录状态必须选择一个状态!' }],
            initialValue:notice?notice.state:'1'
          })(
            <RadioGroup name="state">
              <Radio value={'1'}>启用</Radio>
              <Radio value={'0'}>禁用</Radio>
            </RadioGroup>
          )}
        </FormItem>
       <FormItem
          {...formItemLayout}
          label="开始时间"
          hasFeedback
        >
          {getFieldDecorator('startDate', {
              initialValue:''
          })(
            <DatePicker  showTime format={dateFormat} style={{width:200}}/>
          )}
        </FormItem>
        <FormItem
          {...formItemLayout}
          label="备注"
          hasFeedback
        >
          {getFieldDecorator('remarks', {
              initialValue:notice ? notice.remarks : ''
          })(
            <TextArea rows={4} />
          )}
        </FormItem>
        <FormItem {...tailFormItemLayout}>
          <div>
            <Button type="primary" htmlType="submit" style={{marginRight:'10px'}}>确定</Button>
            <Button onClick={close}>取消</Button>
          </div>
        </FormItem>
      </Form>
    );
  }
}

const WrappedNoticeForm = Form.create()(NoticeForm);
export default WrappedNoticeForm
